/** @format */

const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const WebpackBar = require('webpackbar');
const WebpackBundleSizeTablePlugin = require('webpack-bundle-size-table-plugin');
const { WebpackManifestPlugin } = require('webpack-manifest-plugin');
const Dotenv = require('dotenv-webpack');

const chalk = require('chalk');

const isDev = process.env.NODE_ENV === 'development';
const server = require('./server');
const config = require('./config');

const { getPath, APP_ENV } = config;

let envConfig;
try {
  envConfig = require(getPath('config/env'));
} catch (e) {
  envConfig = {};
}
module.exports = [
	new Dotenv(),
	new WebpackManifestPlugin(),
  new HtmlWebpackPlugin({
    title: 'react-webpack5',
    template: path.resolve(__dirname, '../../public/index.html'),
		inject: true,
		manifest: 'manifest.json'
  }),
  new WebpackBar({
    name: '我的项目',
    color: '#85d', // 默认green，进度条颜色支持HEX
    basic: true, // 默认true，启用一个简单的日志报告器
    reporter: {
      change() {
        console.log(chalk.blue.bold('文件修改，重新编译...'));
      },
      afterAllDone(context) {
        console.log(chalk.bgBlue.white(' 我的项目 ') + chalk.green(' 编译完成'));
        isDev
					&& console.log(
					  chalk.bgBlue.white(' 我的项目 ')
							+ chalk.green(` 开发预览地址：http://127.0.0.1:${server.port}`),
					);
      },
    },
  }),
  new webpack.DefinePlugin({
		BASE_URL: JSON.stringify(envConfig[APP_ENV]?.BASEURL),
		IS_MOCK: JSON.stringify('true'),
		API_KEY: process.env.API_KEY,
    BASE_URL: process.env.BASE_URL
  }),
  new WebpackBundleSizeTablePlugin(),
  new webpack.ContextReplacementPlugin(/moment[/\\]locale$/, /zh-cn|ja|ko/),
].filter(Boolean);
